<li class="browse clickableEffect">
    <div data-bind="click: $parent.viewBook, attr: { 'id': overView.dataId() + 'id'}">
        <div class="overview-narrow"></div>
        <div>
            <div class="overview-images" style="z-index: 0">
                <img class="sml-loading" />
            </div>
            <img onLoad=" $(this).fadeIn('normal').siblings('div').fadeOut('normal') " data-bind="attr:{src: overView.thumbnailMediumDisplay}" style="display: none; z-index: 1" class="overview-images" />
        </div>
        <div style="margin-left: 54px; height:80px;line-height: 10px;">
            <a class="title" data-bind="text: overView.title"></a>
            <div class="overview-item">
                <p style="line-height: 18px" data-bind="text: overView.author() + ', ' + overView.year()" class="overview-author author"></p>
                <div class="overview-text" data-bind="text: overView.subExtraText">
                </div>
            </div>
        </div>
    </div>
</li>